import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';
import 'package:star_menu/star_menu.dart';
import 'package:styled_widget/styled_widget.dart';

import '../controller/drawing_board_controller.dart';

/// 画笔工具栏
class ToolsMenuWidget extends StatelessWidget {
  ToolsMenuWidget({
    super.key,
    this.onItemTapped,
  });

  /// 选项点击的回调事件
  void Function(int index, StarMenuController controller)? onItemTapped;

  @override
  Widget build(BuildContext context) {
    return SizedBox(
      width: 30.r,
      height: 30.r,
      child: StarMenu(
        params: const StarMenuParameters(
            shape: MenuShape.grid,
            gridShapeParams: GridShapeParams(
              columns: 3,
              columnsSpaceV: 12,
              columnsSpaceH: 12,
            ),
            centerOffset: Offset(-70, -70)),
        onItemTapped: onItemTapped,
        items: _tools(context),
        child: Icon(Icons.pan_tool, size: 30.r),
      ),
    );
  }

  List<Widget> _tools(BuildContext context) {
    final dbc = Get.find<DrawingBoardController>();

    return [
      _getIcon(Icons.edit).gestures(onTap: () {
        dbc.setPaintContent(Icons.edit);
      }),
      _getIcon(Icons.brush).gestures(onTap: () {
        dbc.setPaintContent(Icons.brush);
      }),
      _getIcon(Icons.show_chart).gestures(onTap: () {
        dbc.setPaintContent(Icons.show_chart);
      }),
      _getIcon(CupertinoIcons.stop).gestures(onTap: () {
        dbc.setPaintContent(CupertinoIcons.stop);
      }),
      _getIcon(CupertinoIcons.circle).gestures(onTap: () {
        dbc.setPaintContent(CupertinoIcons.circle);
      }),
      _getIcon(CupertinoIcons.bandage).gestures(onTap: () {
        dbc.setPaintContent(CupertinoIcons.bandage);
      }),
      SizedBox(
        width: 150.r,
        height: 20.r,
        child: GetX<DrawingBoardController>(
          builder: (controller) {
            return Slider(
              value: dbc.strokeWidth.value,
              max: 40,
              min: 1,
              divisions: 40,
              label: '${dbc.strokeWidth.value.toInt()}',
              onChanged: (double v) => dbc.setStyle(v),
            );
          },
        ),
      ),
    ];
  }

  Widget _getIcon(IconData iconData) {
    return GetX<DrawingBoardController>(
      builder: (controller) {
        final dbc = Get.find<DrawingBoardController>();

        Color color = Colors.black87;
        if (dbc.tid.value == iconData) {
          color = Colors.blue;
        }

        return Icon(iconData, color: color, size: 30.r);
      },
    );
  }
}

/// slider 让轨道宽度等于 Slider 宽度，左右两边不会有边距
class CustomTrackShape extends RoundedRectSliderTrackShape {
  ///
  Rect getPreferredRect({
    required RenderBox parentBox,
    Offset offset = Offset.zero,
    required SliderThemeData sliderTheme,
    bool isEnabled = false,
    bool isDiscrete = false,
  }) {
    final double trackHeight = sliderTheme.trackHeight ?? 0;
    final double trackLeft = offset.dx;
    final double trackTop =
        offset.dy + (parentBox.size.height - trackHeight) / 2;

    /// 让轨道宽度等于 Slider 宽度
    final double trackWidth = parentBox.size.width;
    return Rect.fromLTWH(trackLeft, trackTop, trackWidth, trackHeight);
  }
}
